﻿@using ZBJF.Warranty.BLL
@model ZBJF.Warranty.Model.InsuranceProductOrder
@{
    Layout = null;
    
    var firstImage = ServiceFactory.SellerInsuranceProductImagesServiceInstance.GetFirstImageByProductId(Model.SellerInsuranceProductID);
    var tags = ServiceFactory.SellerInsuranceProductTagsServiceInstance.LoadBySellerInsuranceProductId(Model.SellerInsuranceProductID).ToList().Select(o => o.TagName).Aggregate(string.Empty, (c, d) => c + "," + d).Trim(',');
    var cardList = Model.InsuranceProductOrderCard.Select(o => new { o.CardNo, o.CardPassword }).Distinct().ToList();
    var sellerEmployee = ServiceFactory.SellerEmployeeServiceInstance.LoadByID(Model.SellerEmployeeID);
}
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
    <title>订单成功</title>
</head>
<body style="width: 100%; margin: 0;padding:0">
    <div style="margin: 0 auto;padding: 0; max-width: 720px; border:solid 1px rgb(237, 237, 237);">
        <div style="background-color: rgb(238, 238, 238); padding:1% 2%; ">
            <div style="font-size: 1.5em; color: rgb(44, 43, 43); font-weight: 600; text-align: right; background: url(/Images/share_img.png) left center no-repeat rgb(238, 238, 238); background-size: contain;">
                订单详情
            </div>
        </div>
        <div style="font-size: 1.2em;font-family: 'Microsoft YaHei'; color: rgb(22, 22, 22); line-height: 1.813; padding: 6px 10px; text-indent: 30px;">
            尊敬的 @Model.BuyUserName 您好，您的订单已购买成功，详情如下，如有疑问，可联系商品销售人员，保障卡的激活方式请查阅邮件底部。
        </div>
        <table style="border-collapse: collapse; width: 100%; border: none; border-top: solid 1px rgb(237, 237, 237); border-bottom: solid 1px rgb(237, 237, 237); text-indent: 10px;">
            <tr>
                <td style="width: 30%;">
                    <img style="width: 100%; max-width: 160px" src="@(firstImage != null ? firstImage.FilePath : "/images/share_img.jpg")" />
                </td>
                <td>
                    <table style="width: 100%; ">
                        <tr>
                            <td>
                                <div style="font-size: 1.2em; font-weight: 600; color: #000; position: relative;padding-bottom:1vmin">
                                    @Model.InsuranceProductName
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <div style="font-size: .8em; color: #aaa;">
                                    @Html.Raw(tags)
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <div style="flex: 1; color: red; font-size: .8em; float: left;padding-top:3vmin">
                                    ¥<span style="font-weight: 600; font-size: 1.2em;">@Model.SaleRetailPrice</span>
                                </div>
                                <div style="color: #a7a7a7; font-size: 1em; float: right;padding-top:3vmin">
                                    @Model.CreateOrderTime.ToString("yyyy-MM-dd HH:mm")
                                </div>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
        <table id="tb_product" style="border-collapse: collapse; width: 100%; border: none; text-indent: 10px; font-size: 1em;">
            <tr>
                <td style="border-top: solid 1px rgb(237, 237, 237); border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0; padding: 6px 0;">订单号</td>
                <td style="border-top: solid 1px rgb(237, 237, 237); border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0;">
                    @Html.DisplayFor(o => o.OrderNo)
                </td>
            </tr>
            <tr>
                <td style="border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0;">商品名称</td>
                <td style="border-right: none; border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0;">
                    @Html.DisplayFor(o => o.InsuranceProductName)
                </td>
            </tr>
            <tr>
                <td style="border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0;">购买数量</td>
                <td style="border-right: none; border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0;">
                    @Html.DisplayFor(o => o.BuyCount)
                </td>
            </tr>
            <tr>
                <td style="border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0;">总价</td>
                <td style="border-right: none; border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0;">
                    @Html.DisplayFor(o => o.TotalPirce)
                </td>
            </tr>
            <tr>
                <td style="border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0;">身份证号</td>
                <td style="border-right: none; border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0;">
                    @Html.DisplayFor(o => o.BuyUserIDNo)
                </td>
            </tr>
            <tr>
                <td style="border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0;">手机</td>
                <td style="border-right: none; border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0;">
                    @Html.DisplayFor(o => o.BuyUserPhone)
                </td>
            </tr>
            <tr>
                <td style="border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0;">电子邮箱</td>
                <td style="border-right: none; border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0;">
                    @Html.DisplayFor(o => o.BuyUserEmail)
                </td>
            </tr>
            <tr>
                <td style="border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0;">销售员</td>
                <td style="border-right: none; border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0;">
                    @Html.DisplayFor(o => o.SellerEmployeeName)
                </td>
            </tr>
            <tr>
                <td style="border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0;">销售员手机</td>
                <td style="border-right: none; border-bottom: solid 1px rgb(237, 237, 237); font-size: 1em !important; padding: 6px 0;">
                    @Html.DisplayFor(o => sellerEmployee.UserPhone)
                </td>
            </tr>
        </table>
        <table id="tb_product_card" style="border-collapse: collapse; width: 100%; border: none; font-size: 1em; text-align: center;">
            <thead>
                <tr>
                    <td colspan="4" style="font-size: 1em; font-family: 'Microsoft YaHei'; color: rgb(30, 30, 30) !important; text-align: center;">
                        <div style="margin: 0 auto; display: flex; display: -webkit-flex; align-items: center; text-align: center; width: 100%; flex: 3;">
                            <div style="color: rgb(83, 83, 83); flex: 0.5;">
                                <hr>
                            </div>
                            <div style="padding: 5px 0; margin: 0 auto; font-size: 1.1em; text-align: center;">
                                您所购买的卡密信息如下
                            </div>
                            <div style="color: rgb(83, 83, 83); flex: 0.5;">
                                <hr>
                            </div>
                        </div>
                    </td>
                </tr>
                <tr style="font-family: 'Microsoft YaHei'; color: rgb(30, 30, 30); text-align: center; padding: 6px 0; background: rgb(252, 228, 214); font-size: 1em;">
                    <td style="border-right: solid 1px rgb(217, 217, 217); border-bottom: solid 1px rgb(217, 217, 217); font-size: 1em !important; padding: 6px 0;">序号</td>
                    <td style="border-right: solid 1px rgb(217, 217, 217); border-bottom: solid 1px rgb(217, 217, 217); font-size: 1em !important; padding: 6px 0;">商品名称</td>
                    <td style="border-right: solid 1px rgb(217, 217, 217); border-bottom: solid 1px rgb(217, 217, 217); font-size: 1em !important; padding: 6px 0;">卡号</td>
                    <td style="border-right: solid 1px rgb(217, 217, 217); border-bottom: solid 1px rgb(217, 217, 217); font-size: 1em !important; padding: 6px 0;">密码</td>
                </tr>
            </thead>
            <tbody>
                @for (int i = 0; i < cardList.Count; i++)
                {
                    var item = cardList[i];
                    <tr style="text-align: center;">
                        <td style="border-right: solid 1px rgb(217, 217, 217); border-bottom: solid 1px rgb(217, 217, 217); font-size: .8em !important; padding: 6px 0;">@(i + 1)</td>
                        <td style="border-right: solid 1px rgb(217, 217, 217); border-bottom: solid 1px rgb(217, 217, 217); font-size: .8em !important; padding: 6px 0;">@Model.InsuranceProductName</td>
                        <td style="border-right: solid 1px rgb(217, 217, 217); border-bottom: solid 1px rgb(217, 217, 217); font-size: .8em !important; padding: 6px 0;">@item.CardNo</td>
                        <td style="border-right: solid 1px rgb(217, 217, 217); border-bottom: solid 1px rgb(217, 217, 217); font-size: .8em !important; padding: 6px 0;">@item.CardPassword</td>
                    </tr>
                }
            </tbody>
        </table>
        <div style="border-radius: 6px; overflow: hidden; padding: 3% 2% 5%;">
            <div style="float: left; width: 38%;">
                <img style="width: 100%;" src="~/Images/zbjfapp.png" />
            </div>
            <div style="float: right; width: 62%;">
                <div style="text-align: center; margin: 1% 0 2% 0; text-align: center; color: gray; font-size: 1em;">
                    扫码下载APP，快速激活保障卡
                </div>
                <ol style="padding-left: 2em; font-size: .8em;">
                    <li>如需激活保障卡，请您用欲保障的手机扫描左侧二维码（安卓及苹果皆可），即可下载用于激活保障的APP。</li>
                    <li>下载完成后，点击"保单激活"，跟随系统提示，即刻快速完成保障卡激活。</li>
                </ol>
            </div>
        </div>
    </div>
</body>
</html>
